<template>
  <div id="home">
    <el-container>
      <el-aside width="200px" style="background-color: rgb(50, 64, 87); height:100vh;">
        <el-menu background-color="rgb(50, 64, 87)" text-color="#fff">
          <el-submenu>
            <template slot="title"
              ><i class="el-icon-message"></i><router-link to="/home/homee">首页</router-link></template
            >
          </el-submenu>
          <el-submenu index="2">
            <template slot="title"
              ><i class="el-icon-menu"></i>数据管理</template>
            <el-menu-item-group>
              <el-menu-item index="2-1"><router-link to="/home/userlist">用户列表</router-link></el-menu-item>
              <el-menu-item index="2-2">商家列表</el-menu-item>
              <el-menu-item index="2-3">食品列表</el-menu-item>
              <el-menu-item index="2-4">订单列表</el-menu-item>
              <el-menu-item index="2-5">管理员列表</el-menu-item>
            </el-menu-item-group>
          </el-submenu>
          <el-submenu index="3">
            <template slot="title"
              ><i class="el-icon-plus"></i>添加数据</template
            >
            <el-menu-item-group>
              <el-menu-item index="3-1">添加商铺</el-menu-item>
              <el-menu-item index="3-2">添加商品</el-menu-item>
            </el-menu-item-group>
          </el-submenu>
          <el-submenu index="4">
            <template slot="title"
              ><i class="el-icon-star-on"></i>图表</template
            >
            <el-menu-item-group>
              <el-menu-item index="4-1">用户分布</el-menu-item>
            </el-menu-item-group>
          </el-submenu>
          <el-submenu index="5">
            <template slot="title"><i class="el-icon-edit"></i>编辑</template>
            <el-menu-item-group>
              <el-menu-item index="5-1">文本编辑</el-menu-item>
            </el-menu-item-group>
          </el-submenu>
          <el-submenu index="6">
            <template slot="title"
              ><i class="el-icon-setting"></i>设置</template
            >
            <el-menu-item-group>
              <el-menu-item index="6-1">管理员设置</el-menu-item>
            </el-menu-item-group>
          </el-submenu>
          <el-submenu index="7">
            <template slot="title"
              ><i class="el-icon-warning-outline"></i>说明</template
            >
            <el-menu-item-group>
              <el-menu-item index="7-1">说明</el-menu-item>
            </el-menu-item-group>
          </el-submenu>
        </el-menu>
      </el-aside>
      <el-container>
        <el-header style="font-size: 12px">
          <p>首页</p>
        </el-header>
        <el-main>
          <router-view></router-view>
        </el-main>
      </el-container>
    </el-container>
  </div>
</template>
<script>
export default {
  name:"Home"
}
</script>
<style>
.el-header {
  width: 100%;
  background-color: #eff2f7;
  color: #333;
  line-height: 60px;
}
.el-container{
  height: 100vh;
}
.el-aside {
  color: #333;
  height: 700px;
  overflow:hidden;
 background: #344057;
}
#home{
  display:flex;
}
</style>

<script>

export default {
  name: "Home",
}
</script>